import { Card, Col, Row, Statistic, Typography } from 'antd'
import { useAuth } from '@store/AuthProvider'
import styles from './dashboard.module.css'

const DashboardPage = () => {
  const { user } = useAuth()

  return (
    <Row gutter={[24, 24]} className={styles.wrapper}>
      <Col span={24}>
        <div className={styles.welcomeCard}>
          <Typography.Title level={3} className={styles.welcomeTitle}>
            欢迎回来，{user?.name}！
          </Typography.Title>
          <Typography.Paragraph className={styles.welcomeDesc}>
            当前系统基于通用企业后台模板，已为你准备好常用的基础设施与示例页面。
          </Typography.Paragraph>
        </div>
      </Col>

      <Col xs={24} md={8}>
        <Card className={styles.statCard}>
          <Statistic title="今日新增任务" value={42} suffix="条" />
        </Card>
      </Col>
      <Col xs={24} md={8}>
        <Card className={styles.statCard}>
          <Statistic title="待处理工单" value={8} suffix="件" />
        </Card>
      </Col>
      <Col xs={24} md={8}>
        <Card className={styles.statCard}>
          <Statistic title="系统健康度" value={99.2} suffix="%" precision={1} />
        </Card>
      </Col>
    </Row>
  )
}

export default DashboardPage


